<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>状态伪类选择器</title>

    <style type="text/css">
        /*:link 设置超链接在未访问的样式*/
        a:link{
            color: red;
        }

        /*:visited 设置超链接以及被访问过的样式*/
        a:visited{
            color: blue;
        }

        /*:hover 设置鼠标悬停时的样式*/
        a:hover{
            color: green;
        }

        /*:active 设置元素在被用户激活时的样式  鼠标被点击 并且没有松开 的时候*/
        a:active{
            color: purple;
        }

        li:hover{
            background-color: tomato;
        }
    </style>


</head>
<body>
<a href="https://www.so.com" target="_blank">去360</a>
<ul>
    <li>aaaaaaaaaaaaaa</li>
    <li>aaaaaaaaaaaaaa</li>
    <li>aaaaaaaaaaaaaa</li>
    <li>aaaaaaaaaaaaaa</li>
    <li>aaaaaaaaaaaaaa</li>
</ul>
</body>
</html>